<template>
    <admin-main :breadcrumbs="breadcrumbs">
        <fold-panel title="Products List" class="panel-default" id="goods-list-panel">
            <data-table class="table-bordered table-hover" :tableHead="tableHead" :tableData="tableData"></data-table>
        </fold-panel>
        <document-title :title="breadcrumbs.title"></document-title>
        <loading :isLoading="isLoad"></loading>
    </admin-main>
</template>

<script>
    /* eslint-disable no-undef */
    import AdminMain from '../AdminMain.vue';
    import FoldPanel from 'vue-fiu-ui/src/main/js/components/panel/FoldPanel';
    import DataTable from 'vue-fiu-ui/src/main/js/components/table/DataTable';
    import DocumentTitle from '../../layout/Title.vue';
    import Loading from '../../layout/Loading.vue';

    export default {
        data () {
            return {
                breadcrumbs: {
                    title: '商品列表',
                    data: [
                        {to: {name: 'Home'}, icon: 'fa-home', cut: true, disabled: false, text: 'Home'},
                        {to: {name: 'Home'}, icon: 'fa-shopping-basket', cut: true, disabled: false, text: '商品'},
                        {to: '#', cut: false, disabled: true, text: '商品列表'}
                    ]
                },
                tableHead: [
                    {text: 'ID'},
                    {text: '名称'},
                    {text: '售价'},
                    {text: '库存'},
                    {text: '上架？'},
                    {text: '上架时间'}
                ],
                tableData: [],
                isLoad: true
            };
        },
        methods: {},
        components: {
            Loading,
            DocumentTitle,
            DataTable,
            FoldPanel,
            AdminMain
        },
        mounted () {
            this.isLoad = false;
        }
    };
</script>
